<template>
	<view class="">
		<view class="imgbox">
			<image src="../../static/image/sucess.png" mode=""></image>
		</view>
		<view class="title">
			订单支付成功
		</view>
		<view class="zhifu">
			支付方式：<text>微信支付</text>
		</view>
		<view class="zhifu">
			支付方式：<text class="price"><text class="danwei">￥</text>180.00</text>
		</view>
		<view class="btnbox">
			<view class="lookorder">
				查看订单
			</view>
			<view class="back">
				回到首页
			</view>
		</view>
		<view class="tishi">
			<view class="title">
				温馨提示
			</view>
			<view class="neir">
				我们不会以订单异常、系统升级为由要求您点击任何网址链接进行退款操作。
			</view>
		</view>
	</view>
</template>

<script>
</script>

<style scoped lang="scss">
	.imgbox {
		width: 200rpx;
		height: 200rpx;

		image {
			width: 200rpx;
			height: 200rpx;
		}

		margin: 50rpx auto;
	}

	.title {
		text-align: center;
		font-family: MicrosoftYaHei-Bold;
		font-size: 30rpx;
		color: #282828;
		font-weight: 700;
	}

	.zhifu {
		font-family: MicrosoftYaHei;
		font-size: 24rpx;
		text-align: center;
		color: #333333;
		margin-top: 56rpx;

		text {
			font-size: 24rpx;
			color: #ff3300;
		}

		.price {
			font-size: 36rpx;
			font-family: PingFang-SC-Bold;
			color: #ff3300;
			font-weight: 700;

			.danwei {
				font-family: PingFang-SC-Bold;
				font-size: 24rpx;
			}
		}
	}

	.btnbox {
		display: flex;
		justify-content: space-around;
		margin-top: 137rpx;

		.lookorder {
			width: 221rpx;
			height: 70rpx;
			background-color: #ff9b2f;
			border-radius: 35rpx;
			line-height: 70rpx;
			text-align: center;
			font-family: MicrosoftYaHei;
			font-size: 24rpx;
			color: #FFFFFF;
		}

		.back {
			width: 221rpx;
			height: 70rpx;
			background-color: #ed2626;
			border-radius: 35rpx;
			line-height: 70rpx;
			text-align: center;
			font-family: MicrosoftYaHei;
			font-size: 24rpx;
			color: #FFFFFF;
		}
	}

	.tishi {
		background-image: url(../../static/image/tishi.png);
		width: 697rpx;
		height: 220rpx;
		background-size: 697rpx 220rpx;
		margin-top: 261rpx;
		margin-left: 26rpx;
		padding: 30rpx 20rpx;
		box-sizing: border-box;

		.title {
			text-align: center;
			font-family: MicrosoftYaHei-Bold;
			font-size: 30rpx;
			color: #ff7d2f;

		}

		.neir {
			font-family: MicrosoftYaHei;
			font-size: 24rpx;
			color: #dd811d;
			line-height: 64rpx;
		}
	}
</style>
